<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<title>订单管理</title>
<script type="text/javascript" src="<c:url value='/static/js/web/preSaleOrder/list.js' />"></script>
</head>

<body>
	<div class="p_page">
		<div class="top_tool" style="text-align: right;">
			<div style="position: absolute;">
				<span>客服电话：<span class="costomerPhone">023-88930888</span></span>
			</div>
			<div style="right: 0">
			<a class="text_a" href="<c:url value="/web/product/list" />">继续购物</a>
			</div>
		</div>
		<c:if test="${fn:length(orders) == 0 }">
			<div style="padding-top: 50px; text-align: center;">您的订单空空如也~</div>
		</c:if>
		<div class="order_list">
		<c:forEach items="${orders }" var="order">
			<div class="order_item" id="order-${order.id}">
				<div class="item_title clear">
					<div class="orderCode_body">订单号：${order.orderCode}</div>
					<div class="orderStatus_body">
						<c:if test="${order.status == 0}" ><span class="orange">待支付</span></c:if>
						<c:if test="${order.status == 1}" ><span class="green">已支付</span></c:if>
						<c:if test="${order.status == 3}" ><span class="blue">交易成功</span></c:if>
						<c:if test="${order.status == 97}" ><span class="">自动取消</span></c:if>
						<c:if test="${order.status == 98}" ><span class="">退订申请中</span></c:if>
						<c:if test="${order.status == 99}" ><span class="">已退订</span></c:if>
						<c:if test="${order.status == 100}" ><span class="">已退款</span></c:if>
					</div>
				</div>
				<div class="item_other" style="display: none;">
					<div class="item_other_item">
						下单时间：<fmt:formatDate value="${order.orderTime}" pattern="yyyy-MM-dd HH:mm:ss"/>
					</div>
					<div class="item_other_item">
						订单金额：<span class="red">￥${order.fullAmount}</span>
					</div>
					<div class="item_other_item">
						<div class="preAmount_body" style="height: 40px;">
						<div class="preAmount_left">预付款：<span class="red">￥${order.preAmount}</span></div>
						<div class="preAmount_right">
							<c:if test="${order.status == 0}" >
								<a href="javascript:void(0);" onclick="payment('${order.preAmount}')" class="button bg-red">立即付款</a>
							</c:if>
						</div>
						</div>
						<c:if test="${order.status == 1}" >
							<div style="line-height: 20px;text-indent:2em;">
								恭喜您！您已成功支付预付款，请于2015年2月13-2月15日营业时间至东方国际相应品牌店
								（黄花园北桥头，江北嘴CBD，平安银行斜对面），凭预定订单号完成您的预购，我们已备好货品恭候您。
								如您有任何疑问，请拨打客服电话023-88930888。
							</div>
					</c:if>
					</div>
					<div class="item_other_item">支付宝账号：${order.alipayAccount}</div>
					<c:if test="${fn:length(order.orderProducts) > 0 }">
						<div class="item_other_item">
							<div class="product_list">
								<c:forEach items="${order.orderProducts }" var="orderProducts">
									<div class="product_item">
										<div class="item-image-box">
											<a href="<c:url value='/web/product/detail?id=${orderProducts.product.id }' />">
												<img src="<c:url value='${orderProducts.product.image1 }' />">
											</a>
										</div>
										<div class="item-info">
											<div class="title">
												<a href="<c:url value='/web/product/detail?id=${orderProducts.product.id }' />">${orderProducts.product.productName }</a>
											</div>
											<div class="price_body">
												单价：<span class="red">￥${orderProducts.buyPrice}</span>
											</div>
											<div class="price_count_body">
												共<span class="red"> ${orderProducts.buyCount} </span>件商品 
												<span style="float: right;">总价：<span class="red">￥${orderProducts.buyCount * orderProducts.buyPrice}</span></span>
											</div>
										</div>
										<hr class="clear"/>
									</div>
								</c:forEach>
							</div>
						</div>
					</c:if>
					<c:if test="${order.status != 98 }" >
						<div class="item_other_item button_body">
							<div class="item_button">
								<c:if test="${order.status == 0 || order.status == 1}" >
									<a href="javascript:void(0);" onclick="unsubscribe('${order.id}')" class="button bg-red">退订</a>
								</c:if>
								<c:if test="${order.status == 3 || order.status == 97 || order.status == 99 || order.status == 100}" >
									<a href="javascript:void(0);" onclick="deleteOrder('${order.id}')" class="button bg-red">删除</a>
								</c:if>
							</div>
						</div>
					</c:if>
				</div>
			</div>
			</c:forEach>
		</div>
	</div>
	<div id="payment-body" class="payment-bg" style="display: none;">
			<div class="img-bg">
				<div style="padding-top: 10px;text-indent:2em;">
					<span>
						请使用支付宝支付预付款，您需支付的预付款金额为：<span class="red">￥<span id="preAmount"></span></span>。或扫描以下二维码快速支付。
						支付成功后，您可在服务号界面进入“我的订单”查询您的订单状态。
					</span>
				</div>
				<img src="<c:url value='/static/skins/images/alipayQrcode.png' />">
				<div style="text-align: center;height: 30px;">
					<span>客服电话：<span class="costomerPhone">023-88930888</span></span>
				</div>
			</div>
	</div>
</body>
</html>